<template>
  <div class="home">
    <div class="home-banner">
      <div class="main">
        <h5>欢迎来到新疆工程建设云</h5>
        <a-input-search class="home-banner__search" placeholder="请输入您要查询的关键词，例如ca、聘用等"
                     size="large" v-model:value="search"
                     enter-button="搜 索" @search="">
        </a-input-search>
      </div>

      <div id="Port" class="home-banner__port">
        <div class="home-banner__portList">
          <a class="home-banner__port-item" v-for="(prot, index) in prots" :key="prot.key">
            <div class="icon" :style="`background-position: -${index*42}px 0`"/>
            <div class="desc">
              <h5>{{prot.label}}</h5>
            </div>
          </a>
        </div>
      </div>
    </div>

  </div>
</template>

<script lang="ts" setup>
import { ref ,onMounted } from 'vue';
import { getArticleListApi } from "@/api/home";
const search = ref('')
const prots = ref([
  { key: 1, path: 'person', label:'个人服务平台'},
  { key: 2, path: 'http://jsy.xjjs.gov.cn:8040/c/uc/login', label:'企业服务平台'},
  { key: 3, path: 'http://jsy.xjjs.gov.cn:8050/g/login', label:'政务服务平台'},
  { key: 4, path: 'http://jsy.xjjs.gov.cn:9011', label:'项目服务平台'},
  { key: 5, path: 'http://jsy.xjjs.gov.cn:9009', label:'建设单位服务平台'},
  { key: 6, path: 'http://220.171.42.84:5031/nologin', label:'建筑工人实名制平台'}
])

const getArticleList = async () => {
  let data = await getArticleListApi({
    itemId: '0hsr1-k62mf0-00u31',current: 1, size: 5});
  console.log(data);
};
const init = () => {
  // getArticleList();
}

onMounted(init);
</script>

<style lang="less" scoped>

</style>

